<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
</head>
<body>
	<span>用户名:</span>
	<input type="text" name="" id="username">
	<br>
	<span>密&nbsp;&nbsp;&nbsp;码:</span>
	<input type="password" name="" id="password">
	<br>
	<span>下次自动登录:</span>
	<input type="checkbox" id="check">
	<br>
	<input type="submit" value="提交信息" id="btn">

</body>
<script>
//获取元素
	var user = document.getElementById('username');
	var pass = document.getElementById('password');
	var btn = document.getElementById('btn');
	var check= document.getElementById('check');
	var myLocal = window.localStorage;
	if (myLocal.getItem('user')) {
		user.value=myLocal.getItem('user');
	    pass.value=myLocal.getItem('pass'); 
}
	
	btn.onclick = function(){
		//在js中通过 .value可以获取输入框内容
		if (user.value==""||pass.value=="") {
		alert('用户名或密码为空');
	}else{
		//保存信息
		if (check.checked==true) {
			alert('下次可以自动登录');
			myLocal.setItem('user',user.value);
			myLocal.setItem('pass',pass.value);  
		}
		}          
	    } 
</script>
</html>